<template>
    <MainSlot v-loading="loading">
        <template v-slot:searchForm>
            <SearchForm v-if="formItemList.length" :formItemList="formItemList" :unfoldFlag="unfoldFlag"
                @search="search" @isUnfold="(v) => { unfoldFlag = v }">
            </SearchForm>
        </template>
        <template v-slot:btn>
            <BtnSlot :btnList="btnList" @handleEvent="getBtnEvent"></BtnSlot>
        </template>
        <template v-slot:table>
            <TableData :config="table_config" :tableThead="tableThead" :dataList="dataList" :loading="loading"
                @selection-change="selectionChange">
            </TableData>
        </template>
        <template v-slot:pagination>
            <Pagination @current-change="handleCurrentChange" :page="page" :total="total">
            </Pagination>
        </template>
        <template v-slot:dialogModule>
            <AddEdit :title="'范畴'" :unitList="unitList" :varietyList="varietyList" @closeDialog="closeDialog"
                :addEditFlag="addEditFlag" :dialogVisible="dialogVisible" :data="formData">
            </AddEdit>
        </template>
    </MainSlot>
</template>
<script>
import MainSlot from "@/components-production-management/MainSlot";
import Pagination from '@/components-production-management/Pagination';
import SearchForm from '@/components-production-management/SearchForm';
import TableData from '@/components-production-management/TableData';
import BtnSlot from '@/components-production-management/BtnSlot';
import EnumSlot from '@/components-production-management/EnumSlot';
import AddEdit from './components/addEdit.vue';
import inspectionScope from '@/api/quality-management/inspectionScope.js';

export default {
    components: { MainSlot, Pagination, SearchForm, TableData, BtnSlot, EnumSlot, AddEdit },
    data() {
        return {
            unfoldFlag: false,
            loading: false,
            dialogVisible: false,
            addEditFlag: 'add',
            selectList: [],
            unitList: [],
            formData: {},
            page: 1,
            total: 10,
            selectIndex: 0,
            searchFormData: {},
            btnList: ['add', 'delete'],
            dataList: [],
            tableThead: [
                { isShow: true, label: '检验范畴', prop: 'scopeTypeName', minWidth: '120px' }
            ],

            // 配置项
            table_config: {
                isCheckBox: true,

                isOperation: true,
                // 表格操作列
                operation: {
                    label: '操作',
                    width: '200',
                    cols: [
                        {
                            label: '编辑',
                            type: 'primary',
                            flag: 'edit',
                            handleRow: this.handleRow
                        },
                        {
                            label: '删除',
                            type: 'danger',
                            flag: 'del',
                            handleRow: this.handleRow
                        }
                    ]
                },
            },
            varietyList: [],
            formItemList: [
                {
                    label: '范畴名称',
                    type: 'input',
                    param: 'scopeTypeName',
                    defaultSelect: '',
                    multiple: false,
                    isShow: true
                }
            ]
        }
    },
    mounted() {
        this.queryPageByCondition();
    },
    methods: {
        delList(deleteList = [], key = 'checkScopeTypeId') {
            let list = []
            deleteList.forEach(item => {
                list.push(item[key])
            })
            console.log(list)
            this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(async () => {
                let res = await inspectionScope.delList(list);
                if (res.success) {
                    this.$message.success(res.msg || '删除成功');
                    this.queryPageByCondition();
                } else {
                    this.$message.warning(res.msg || '删除失败');
                }
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消删除'
                });
            });
        },
        queryPageByCondition() {
            let params = {
                page: this.page,
                size: 10,
                entity: {
                    ...this.searchFormData
                }
            }
            this.loading = true;
            inspectionScope.queryPageByCondition(params).then(res => {
                this.loading = false;
                if (res.success) {
                    this.dataList = res.data.content || [];
                    this.total = res.data.totalElements;
                    if (res.data.totalPages && this.page > res.data.totalPages) {
                        this.page = res.data.totalPages;
                        this.queryPageByCondition();
                    }
                } else {
                    this.$message.warning(res.msg || '分页查询失败')
                }
            }).catch(err => {
                this.loading = false;
                console.log(err)
            })
        },
        search(data) {
            this.page = 1;
            this.searchFormData = { ...this.searchFormData, ...data };
            this.queryPageByCondition();
        },
        handleCurrentChange(page) {
            this.page = page;
            this.queryPageByCondition();
        },
        // 操作方法
        handleRow(rowData, item) {
            if (item.flag == 'edit') {
                this.dialogVisible = true;
                this.formData = JSON.parse(JSON.stringify(rowData))
            } else if (item.flag == 'del') {
                this.delList([rowData]);
            }
            this.addEditFlag = item.flag
        },
        // 多选方法
        selectionChange(val) {
            this.selectList = val || []
        },
        //获取选中Btn
        getBtnEvent(flag) {
            console.log(flag)
            if (flag == 'add') {
                this.dialogVisible = true
            } else if (flag == 'delete') {
                if (this.selectList.length > 0) {
                    this.delList(this.selectList)
                } else {
                    this.$message.warning('请先选择表单数据项后再删除！')
                }
            }
            this.addEditFlag = flag
        },
        //关闭弹窗
        closeDialog() {
            this.dialogVisible = false;
            this.queryPageByCondition();
        },
    }
};
</script>
<style lang="scss" scoped></style>